
// 程序是如何换肤(主题)的？
// 1. 定义多套主题， 并选择一套主题作为当前主题
// 2. 元素在创建时， 从当前主题中获取样式值， 并设置到元素自身做为默认样式值
// 3. 元素在渲染时， 使用自身的样式属性值进行渲染
// 4. 当需要切换主题时， 只需更改当前主题， 重新刷新元素样式并渲染即可
// 创建主题， 生效主题，应用主题， 切换主题
// 主题主要功能是更改UI的样式， 主要是颜色， 字体， 边框， 填充等样式

export class ITheme {
    constructor() {
        // 主题色
        this.m_primary_color = "#409EFF";
        this.m_success_color = "#67C23A";
        this.m_warning_color = "#E6A23C";
        this.m_danger_color = "#F56C6C";
        this.m_info_color = "#909399";

        this.m_darker_primary_color = "rgb(51, 126, 204)";
        this.m_dark_primary_color = "rgb(121, 187, 255)";
        this.m_base_primary_color = "rgb(160, 207, 255)";
        this.m_light_primary_color = "rgb(198, 226, 255)";
        this.m_lighter_primary_color = "rgb(217, 236, 255)";
        this.m_extra_light_primary_color = "rgb(236, 245, 255)";

        this.m_darker_success_color = "rgb(82, 155, 46)";
        this.m_dark_success_color = "rgb(149, 212, 117)";
        this.m_base_success_color = "rgb(179, 225, 157)";
        this.m_light_success_color = "rgb(209, 237, 196)";
        this.m_lighter_success_color = "rgb(225, 243, 216)";
        this.m_extra_light_success_color = "rgb(240, 249, 235)";

        this.m_darker_warning_color = "rgb(184, 130, 48)";
        this.m_dark_warning_color = "rgb(238, 190, 119)";
        this.m_base_warning_color = "rgb(243, 209, 158)";
        this.m_light_warning_color = "rgb(248, 227, 197)";
        this.m_lighter_warning_color = "rgb(250, 236, 216)";
        this.m_extra_light_warning_color = "rgb(253, 246, 236)";

        this.m_darker_danger_color = "rgb(196, 86, 86)";
        this.m_dark_danger_color = "rgb(248, 152, 152)";
        this.m_base_danger_color = "rgb(250, 182, 182)";
        this.m_light_danger_color = "rgb(252, 211, 211)";
        this.m_lighter_danger_color = "rgb(253, 226, 226)";
        this.m_extra_light_danger_color = "rgb(254, 240, 240)";

        this.m_darker_info_color = "rgb(115, 118, 122)";
        this.m_dark_info_color = "rgb(177, 179, 184)";
        this.m_base_info_color = "rgb(200, 201, 204)";
        this.m_light_info_color = "rgb(222, 223, 224)";
        this.m_lighter_info_color = "rgb(233, 233, 235)";
        this.m_extra_light_info_color = "rgb(244, 244, 245)";

        // 文本颜色
        this.m_primary_text_color = "#303133";
        this.m_regular_text_color = "#606266";
        this.m_secondary_text_color = "#909399";
        this.m_placeholder_text_color = "#A8ABB2";
        this.m_disabled_text_color = "#C0C4CC";

        // 边框颜色
        this.m_darker_border_color = "#CDD0D6";
        this.m_dark_border_color = "#D4D7DE";
        this.m_base_border_color = "#DCDFE6";
        this.m_light_border_color = "#E4E7ED";
        this.m_lighter_border_color = "#EBEDF5";
        this.m_extra_light_border_color = "#F2F6FC";

        // 填充颜色
        this.m_darker_fill_color = "#E6E8EB";
        this.m_dark_fill_color = "#EBEDF0";
        this.m_base_fill_color = "#F0F2F5";
        this.m_light_fill_color = "#F5F7FA";
        this.m_lighter_fill_color = "#FAFBFA";
        this.m_extra_light_fill_color = "#FAFCFF";
        this.m_blank_fill_color = "#FFFFFF";

        // 基础颜色
        this.m_basic_black_color = "#000000";
        this.m_basic_white_color = "#FFFFFF";
        this.m_base_background_color = "#FFFFFF";
        this.m_page_background_color = "#F2F3F5";
        this.m_overlay_background_color = "#FFFFFF";

        // 行高
        this.m_no_line_height = 1;
        this.m_compact_line_height = 1.3;
        this.m_regular_line_height = 1.5;
        this.m_loose_line_height = 1.7;

        // 字体
        this.m_extra_large_font_size = 20;
        this.m_large_font_size = 18;
        this.m_medium_font_size = 16;
        this.m_base_font_size = 14;
        this.m_small_font_size = 13;
        this.m_extra_small_font_size = 12;

        // 常用元素样式
        this.m_line_height = 1.5;
        this.m_font_size = 16;
        this.m_font_family = "Arial, sans-serif";
        this.m_font_color = this.m_primary_text_color;
        this.m_background_color = this.m_base_background_color;
        this.m_hover_font_color = this.m_primary_color;
        this.m_hover_background_color = this.m_light_fill_color;
        this.m_padding_top_bottom = 4;
        this.m_padding_left_right = 8;
        this.m_border_radius = 4;
        this.m_border_width = 1;
        this.m_border_style = "solid";
        this.m_border_color = this.m_base_border_color;
        this.m_inline_width = 120;
        this.m_inline_height = this.m_font_size * this.m_line_height + this.m_border_width * 2 + this.m_padding_top_bottom * 2;
    }

    // 常用元素样式
    GetLineHeight() { return this.m_line_height; }
    GetFontSize() { return this.m_font_size; }
    GetFontFamily() { return this.m_font_family; }
    GetFontColor() { return this.m_font_color; }
    GetBackgroundColor() { return this.m_background_color; }
    GetHoverFontColor() { return this.m_hover_font_color; }
    GetHoverBackgroundColor() { return this.m_hover_background_color; }
    GetPaddingTopBottom() { return this.m_padding_top_bottom; }
    GetPaddingLeftRight() { return this.m_padding_left_right; }
    GetBorderRadius() { return this.m_border_radius; }
    GetBorderWidth() { return this.m_border_width; }
    GetBorderStyle() { return this.m_border_style; }
    GetBorderColor() { return this.m_border_color; }
    GetInlineWidth() { return this.m_inline_width; }
    GetInlineHeight() { return this.m_inline_height; }

    // 文本颜色
    GetPrimaryTextColor() { return this.m_primary_text_color; }
    GetRegularTextColor() { return this.m_regular_text_color; }
    GetSecondaryTextColor() { return this.m_secondary_text_color; }
    GetPlaceholderTextColor() { return this.m_placeholder_text_color; }
    GetDisabledTextColor() { return this.m_disabled_text_color; }

    // 字体
    GetExtraLargeFontSize() { return this.m_extra_large_font_size; }
    GetLargeFontSize() { return this.m_large_font_size; }
    GetMediumFontSize() { return this.m_medium_font_size; }
    GetBaseFontSize() { return this.m_base_font_size; }
    GetSmallFontSize() { return this.m_small_font_size; }
    GetExtraSmallFontSize() { return this.m_extra_small_font_size; }

    // 行高
    GetNoLineHeight() { return this.m_no_line_height; }
    GetCompactLineHeight() { return this.m_compact_line_height; }
    GetRegularLineHeight() { return this.m_regular_line_height; }
    GetLooseLineHeight() { return this.m_loose_line_height; }

    // 基础颜色
    GetBasicBlackColor() { return this.m_basic_black_color; }
    GetBasicWhiteColor() { return this.m_basic_white_color; }
    GetBaseBackgroundColor() { return this.m_base_background_color; }
    GetPageBackgroundColor() { return this.m_page_background_color; }
    GetOverlayBackgroundColor() { return this.m_overlay_background_color; }

    // 填充颜色
    GetDarkerFillColor() { return this.m_darker_fill_color; }
    GetDarkFillColor() { return this.m_dark_fill_color; }
    GetBaseFillColor() { return this.m_base_fill_color; }
    GetLightFillColor() { return this.m_light_fill_color; }
    GetLighterFillColor() { return this.m_lighter_fill_color; }
    GetExtraLightFillColor() { return this.m_extra_light_fill_color; }
    GetBlankFillColor() { return this.m_blank_fill_color; }

    // 边框颜色
    GetDarkerBorderColor() { return this.m_darker_border_color; }
    GetDarkBorderColor() { return this.m_dark_border_color; }
    GetBaseBorderColor() { return this.m_base_border_color; }
    GetLightBorderColor() { return this.m_light_border_color; }
    GetLighterBorderColor() { return this.m_lighter_border_color; }
    GetExtraLightBorderColor() { return this.m_extra_light_border_color; }

    // 主题色
    GetPrimaryColor() { return this.m_primary_color; }
    GetSuccessColor() { return this.m_success_color; }
    GetWarningColor() { return this.m_warning_color; }
    GetDangerColor() { return this.m_danger_color; }
    GetInfoColor() { return this.m_info_color; }

    GetDarkerPrimaryColor() { return this.m_darker_primary_color; }
    GetDarkPrimaryColor() { return this.m_dark_primary_color; }
    GetBasePrimaryColor() { return this.m_base_primary_color; }
    GetLightPrimaryColor() { return this.m_light_primary_color; }
    GetLighterPrimaryColor() { return this.m_lighter_primary_color; }
    GetExtraLightPrimaryColor() { return this.m_extra_light_primary_color; }

    GetDarkerSuccessColor() { return this.m_darker_success_color; }
    GetDarkSuccessColor() { return this.m_dark_success_color; }
    GetBaseSuccessColor() { return this.m_base_success_color; }
    GetLightSuccessColor() { return this.m_light_success_color; }
    GetLighterSuccessColor() { return this.m_lighter_success_color; }
    GetExtraLightSuccessColor() { return this.m_extra_light_success_color; }

    GetDarkerWarningColor() { return this.m_darker_warning_color; }
    GetDarkWarningColor() { return this.m_dark_warning_color; }
    GetBaseWarningColor() { return this.m_base_warning_color; }
    GetLightWarningColor() { return this.m_light_warning_color; }
    GetLighterWarningColor() { return this.m_lighter_warning_color; }
    GetExtraLightWarningColor() { return this.m_extra_light_warning_color; }

    GetDarkerDangerColor() { return this.m_darker_danger_color; }
    GetDarkDangerColor() { return this.m_dark_danger_color; }
    GetBaseDangerColor() { return this.m_base_danger_color; }
    GetLightDangerColor() { return this.m_light_danger_color; }
    GetLighterDangerColor() { return this.m_lighter_danger_color; }
    GetExtraLightDangerColor() { return this.m_extra_light_danger_color; }

    GetDarkerInfoColor() { return this.m_darker_info_color; }
    GetDarkInfoColor() { return this.m_dark_info_color; }
    GetBaseInfoColor() { return this.m_base_info_color; }
    GetLightInfoColor() { return this.m_light_info_color; }
    GetLighterInfoColor() { return this.m_lighter_info_color; }
    GetExtraLightInfoColor() { return this.m_extra_light_info_color; }
}


let current_theme = new ITheme();
export function GetCurrentTheme() { return current_theme; }
export function SetCurrentTheme(theme) { current_theme = theme; }